<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>后台管理系统</title>
    <link rel="stylesheet" href="/static/layui/layui/layui.js" />
    <link rel="stylesheet" href="/static/layui/layui/css/layui.css" />
    <link rel="stylesheet" href="/static/index/index.css">


</head>

<body background="/image/bg.png" class="bg_image">
    <div class="lyx_main">
        <fieldset class="layui-elem-field layui-field-title lyx_top ">
            <legend>欢迎登陆-程序员后台管理平台</legend>
        </fieldset>
        <div class="layui-containter ">
            <form class="layui-from" id="userForm">
                <div class="layui-row layui-col-space15 lyx_from ">
                    <div class="layui-col-xs12 layui-col-sm12 layui-col-md12 ">
                        <div class="layui-from-item ">
                            <input type="text" name="username" lay-verify="username" placeholder="账号 " class="layui-input ">
                        </div>
                        <i class="layui-icon layui-icon-username lyx_icon_user"></i>
                    </div>
                    <div class="layui-col-xs12 layui-col-sm12 layui-col-md12 ">
                        <div class="layui-item ">
                            <input type="password" name="password" id="passsword" lay-verify="password" placeholder="密码 " class="layui-input ">
                        </div>
                        <i class="layui-icon layui-icon-password lyx_icon_password "></i>
                    </div>
                    <div class="layui-col-xs12 layui-col-sm12 layui-col-md12 ">
                        <div class="layui-item ">
                            <input type="text" name="code" lay-verify="code" placeholder="请输入验证码 " class="input-val">
                            <div id="canvas">
                                <image id="changeImage" src="{:url('login/verify')}">
                            </div>
                        </div>

                    </div>

                    <div class="layui-col-xs12 layui-col-sm12 layui-col-md12 ">
                        <div class="layui-item ">
                            <button class="layui-btn layui-btn-fluid " lay-submit lay-filter="form">立即登录</button>
                        </div>

                    </div>
                </div>
            </form>


        </div>
    </div>


    <script text="text/javascript" src="/static/jquery/jquery.min.js"></script>
    <script text="text/javascript" src="/static/layui/layui/layui.js"></script>
    <script>
        $(function() {
            var changeCode = $("#changeImage").attr("src");
            $("#changeImage").click(function() {
                if (changeCode.indexOf('?') > 0) {
                    $("#changeImage").attr("src", changeCode + '&random' + Math.random());
                } else {
                    $("#changeImage").attr("src", changeCode.replace(/\?.*$/, '') + '?' +
                        Math.random());
                }

            });


            // layui.use("form", function() {
            //     var form = layui.form;
            //      var $ = layui.$;
            //     //监听提交
            //     form.on('submit(form)', function(data) {

            //         console.log(data.field);
            //         $.ajax({
            //             url: "{:url('login/save')}",
            //             type: "post",
            //             data:data.field,   
            //             dataType: 'JSON',
            //             success: function(res) {
            //                 if (res.code == '200') {
            //                     layer.msg(res.msg)
            //                 } else {
            //                     // layer.msg('111')
            //                        alert('121')
            //                 }
            //             }

            //         })
            //         return false;

            //     });

            // });

            $("form").submit(function(e) {
                var res = $(this).serialize();
                var url = "{:url('login/save')}";
                $.ajax({
                    url: url,
                    data: res,
                    type: 'post',
                    success: function(data) {
                        if (data.code == 200) {
                            layer.alert(data.msg, {
                                icon: 3
                            })
                            window.location.href = "{:url('index/index')}"

                        } else {
                            layer.msg(data.msg)
                        }

                    }
                });

                return false;
            })



        })
    </script>





</body>



</html>